<template>
	<view style="text-align: center;">
		<view style="margin-top: 100px;">
			<image :src="iconFilePath" @click="updateImage()" mode="aspectFill"></image>
			<navigator url="/pages/Login/Login" open-type="reLaunch">
				<button>登录注册页</button>
			</navigator>
			<navigator url="/pages/demos/CityDiscovery/CityDiscovery">
				<button>城市探索</button>
			</navigator>
			<navigator url="/pages/demos/weather/weather">
				<button>天气预报</button>
			</navigator>
			<button @click="downloadAndShowNetImage">下载网络图片</button>
			<image :src="netImagePath" mode="widthFix" v-if="netImagePath" style="margin-top: 20px;"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				iconFilePath: "/static/头像.jpg",
				netImagePath: '' 
			}
		},
		methods: {
			updateImage() {
				uni.chooseImage({
					count: 1,
					sourceType: ['album'],
					success: (res) => {
						console.log("updateImage choose:" + res.tempFilePaths[0]);
						uni.previewImage({
							urls: res.tempFilePaths
						});
						this.iconFilePath = res.tempFilePaths[0]
					}
				});
			},
			downloadAndShowNetImage() {
				const imageUrl = "/static/示例图.webp";
				uni.downloadFile({
					url: imageUrl,
					onProgressUpdate: (res) => {
						console.log('下载进度：' + res.progress + '%');
						console.log('已下载字节数：' + res.totalBytesWritten);
						console.log('总字节数：' + res.totalBytesExpectedToWrite);
					},
					success: (downloadRes) => {
						if (downloadRes.statusCode === 200) {
							const tempFilePath = downloadRes.tempFilePath;
							this.netImagePath = tempFilePath;
							console.log('图片下载成功，临时路径：', tempFilePath);
						}
					},
					fail: (err) => {
						console.error('图片下载失败：', err);
					}
				});
			}
		}
	}
</script>

<style>

</style>